<template>
    <div id="credit-login">
      <div class="history-tab" v-if="loginshow">
          <button-tab v-model="switchTab">
            <button-tab-item @on-item-click="loanType">贷款</button-tab-item>
            <button-tab-item @on-item-click="creditType">信用卡</button-tab-item>
          </button-tab>
        </div>
        <div class="btton_tab_history" v-if="loginshow"></div>
        <div v-show="listShow">
          <scroller v-if="loginshow" lock-x scrollbar-y use-pullup  @on-pullup-loading="loadMore" v-model="status" ref="scroller">
            <div class="box2">
              <div class="product-list loan_product" v-for="(loan,index) in loanlist" :key="index">
                <loan-message :partnershow="true" :loandesc="loandesc" :loan="loan" :partnerType="partnerType"></loan-message>
                <div class="onceapply" @click="apply(index)">立即申请</div>
                <div class="circle"></div>
              </div>
              <add :addposition="1"></add>
            </div>
            <div slot="pullup" class="xs-plugin-pullup-container xs-plugin-pullup-up" style="position: absolute; width: 100%; height: 40px; bottom: -40px; text-align: center;">
              <span v-show="status.pullupStatus === 'default'"></span>
              <span class="pullup-arrow" v-show="status.pullupStatus === 'down' || status.pullupStatus === 'up'" :class="{'rotate': status.pullupStatus === 'up'}">松开加载</span>
              <span v-show="status.pullupStatus === 'loading'"><spinner type="ios-small"></spinner></span>
            </div>
          </scroller>
        </div>
        <div v-show="!listShow">
          <scroller v-if="loginshow" lock-x scrollbar-y use-pullup  @on-pullup-loading="loadMore" v-model="status" ref="scroller">
            <div class="box2">
              <div class="product-list"  v-for="(loan,index) in creditlist" :key="index">
                <loan-message :partnershow="true" :loandesc="loandesc" :loan="loan" :partnerType="partnerType"></loan-message>
                <div class="onceapply" @click="apply(index)">立即申请</div>
                <div class="circle"></div>
              </div>
              <add :addposition="1"></add>
            </div>
            <div slot="pullup" class="xs-plugin-pullup-container xs-plugin-pullup-up" style="position: absolute; width: 100%; height: 40px; bottom: -40px; text-align: center;">
              <span v-show="status.pullupStatus === 'default'"></span>
              <span class="pullup-arrow" v-show="status.pullupStatus === 'down' || status.pullupStatus === 'up'" :class="{'rotate': status.pullupStatus === 'up'}">松开加载</span>
              <span v-show="status.pullupStatus === 'loading'"><spinner type="ios-small"></spinner></span>
            </div>
          </scroller>
        </div>
      <div v-if="!loginshow">
        <partner-index></partner-index>
      </div>
    </div>
</template>
<script>
import Add from '../comment/Add'
import LoanMessage from '../comment/LoanMessage'
import PartnerIndex from '../components/PartnerIndex'
import { Scroller, Spinner, ButtonTab, ButtonTabItem } from 'vux'
import api from '../api'
import utils from '../utils'
export default {
  data () {
    return {
      loandesc: false,
      loginshow: false,
      creditloanlist: [],
      loanlist: [],
      creditlist: [],
      listShow: true,
      switchTab: 0, // 切换贷款，信用卡
      PageNum: 100, // 记录每页数
      partnerType: '1',  // 信贷1，保险2 信用卡3参数
      count: 1,
      status: {
        pullupStatus: 'default',
        pulldownStatus: 'default'
      }
    }
  },
  components: {
    Add,
    Scroller,
    LoanMessage,
    Spinner,
    PartnerIndex,
    ButtonTab,
    ButtonTabItem
  },
  created () {
    window.document.title = '信贷客着陆页'
    if (utils.getQueryString('partnerId') && utils.getQueryString('partnerId') !== null && utils.getQueryString('partnerId') !== undefined && utils.getQueryString('partnerId') !== 'undefined') {
      this.loginshow = false
    } else {
      this.loginshow = true
    }
    var params = {
        page: 1,
        perPage: '',
        partnerType: '1'
      }
      api.creditloan(params).then(res => {
        console.log(res)
        if (res.status === 200) {
          this.loanlist = res.data.list
          if (this.loanlist.length === 0) {
            this.lengthshow = true
          } else {
            this.lengthshow = false
          }
        }
      })
      var paramsed = {
        page: 1,
        perPage: '',
        partnerType: '3'
      }
      api.creditloan(paramsed).then(res => {
        console.log(res)
        if (res.status === 200) {
          this.creditlist = res.data.list
          if (this.creditlist.length === 0) {
            this.lengthshow = true
          } else {
            this.lengthshow = false
          }
        }
      })
      if (utils.getQueryString('typeTab') === '1' || this.$store.state.credit_type === '3') {
        this.listShow = false
        this.switchTab = 1
        this.$store.commit('creditShare','1')
      } else {
        this.listShow = true
        this.switchTab = 0
        this.$store.commit('resetShare','')
      }
      utils.refreshShare(this.$wechat, this.$store)
  },
  methods: {
    loadMore () {
      this.count ++
      this.PageNum = 10 * this.count + 100
      this.$vux.loading.show({
        text: '加载更多'
      })
      setTimeout(() => {
        this.loadmore(this.PageNum)
        setTimeout(() => {
          this.$refs.scroller.donePullup()
        }, 10)
      }, 2000)
    },
    loadmore (index) {
       if (this.listShow === true) {
        var params = {
        page: 1,
        perPage: index,
        partnerType: '1'
      }
      api.creditloan(params).then(res => {
        console.log(res)
        if (res.status === 200) {
          this.loanlist = res.data.list
        } else if (res.status === '400005016') {
          this.$router.push('/creditGuest/index')
        }
      })
      } else if (this.listShow === false) {
        var params = {
        page: 1,
        perPage: index,
        partnerType: '3'
      }
      api.creditloan(params).then(res => {
        console.log(res)
        if (res.status === 200) {
          this.creditlist = res.data.list
        } else if (res.status === '400005016') {
          this.$router.push('/creditGuest/index')
        }
      })
      }
    },
    loanType () {
      this.listShow = true
      this.partnerType = '1'
      this.$store.commit('resetShare','')
      utils.jssdkwx(api, this.$wechat, this.$store)
    },
    creditType () {
      this.listShow = false
      this.partnerType = '3'
      this.$store.commit('creditShare','1')
      utils.jssdkwx(api, this.$wechat, this.$store)
    },
    apply (index) {
      this.creditloanlist = []
      if (this.listShow === true) {
        this.creditloanlist = this.loanlist
      } else if (this.listShow === false) {
        this.creditloanlist = this.creditlist
      }
      if (this.creditloanlist[index].partnerId) {
        window.location.href = '/customer/verify?shareParam=share&partnerId=' + this.creditloanlist[index].partnerId + '&userId=' + utils.getQueryString('userId') + '&channel=' + utils.getQueryString('channel')
      } else {
        this.$vux.toast.show({
          text: '合作方不存在',
          type: 'success',
          width: '4rem'
        })
      }
    }
  }
}
</script>

